<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<%@ include file="../include/include.jsp"%>
<title>【${city}${car.online.title}】_麦麦车二手车网络超市</title>
<meta name="description" content="${city}${car.online.title}二手车，行驶里程:${car.mileage}万公里，上牌日期：${car.registerDate}，报价：${car.price}，多角度清晰照片，详细配置，全方位展示车源信息，${city}地区最可靠的二手车交易。" />
<meta name="Keywords" content="${city}二手${car.brand.name},${city}二手车${car.models.name}" />
<link rel="stylesheet" type="text/css" href="${cssPath}/resources/css/car-info.css">
</head>
<body>
	<%@ include file="../include/head.jsp"%>
	<!--#cnt 中间的内容-->
	<div id="cnt">
		<div class="cnt-wrap">
			<div class="left-cnt f-fl">
				<!--path-wrap 面包屑-->
				<div class="path-wrap">
					<span>当前位置：</span>
					<a href="${contextPath}">二手车网络超市</a>
					<span>&gt;</span>
					<a href="${contextPath}/buycar/">${city}认证二手车</span></a>
					<span>&gt;</span>
					<a href="${contextPath}/${car.brand.enname}/">${city}二手${car.brand.name}</a>
					<span>&gt;</span>
					<a href="${contextPath}/${car.brand.enname}/${car.models.enname}/">${city}二手${car.models.name}</a>
				</div>
				<!--path-wrap end-->
				<!--car-info-wrap 信息简介-->
				<div class="car-info-wrap">
					<div class="car-name">
						<h1 class="text-ellipsis">
							${car.online.title}
						</h1>
					</div>
					<div class="car-img-wrap f-fl">
						<div class="car-img">
						<c:set var="hasMain" value="false" />
							<c:if test="${not empty car.picName}">
								<c:forEach var="picName" items="${car.picName}"
									varStatus="status">
									<c:if test="${picName.isMain}">
										<img id="main-img" src="${car.imgPath}/${picName.middle}" alt="${picName.fileName}" title="${car.online.title}"  width="351px" height="258px"/>
										<c:set var="hasMain" value="true" />
									</c:if>
								</c:forEach>
								<c:if test="${!hasMain}">
									<img src="${car.imgPath}/${car.picName[0].middle}" alt="${car.picName[0].fileName}" title="${car.online.title}" width="351px" height="258px" />
								</c:if>
							</c:if>
						</div>
						<c:if test="${not empty car.picName}">
						<div class="thumbnail-img">
							<span href="#" class="pre-icon mmche-icon f-fl"></span>
							<div class="car-small-imgs">
							<ul class="f-oh f-fl" style="width:${76*fn:length(car.picName)}px">
								<c:forEach var="picName" items="${car.picName}" varStatus="status">
								<li class="${(!hasMain&&status.index==0)||picName.isMain?'thumbActive':''}">
									<img src="${car.imgPath}/${picName.small}" middle="${car.imgPath}/${picName.middle}" alt="${picName.fileName}" title="${picName.fileName}" width="68px" height="46px"/>
								</li>
								</c:forEach>
							</ul>
							</div>
							<span href="#" class="next-icon mmche-icon f-fl"></span>
							<div class="f-clear"></div>
						</div>
						</c:if>
					</div>
					<div class="info-wrap f-fr">
						<div class="car-price">
							<div class="mmche-price">
								<fmt:formatNumber var="price" value="${(car.online.price)/10000}" pattern="#.0#"/>
								<span>麦麦车一口价：</span><span class="price-sum">￥${price}</span><span class="size-14">万</span>
							</div>
							<div class="car-info">
								新车价：${car.newCarPrice}元（含购置税）
							</div>
						</div>
						<ul class="info-item f-oh">
							<li class="car-info">
								品　　牌：<a href="${contextPath}/car/${car.brand.enname}">${car.brand.name}</a>
							</li>
							<li class="car-info">
								车　　系：<a href="${contextPath}/car/${car.brand.enname}/${car.models.enname}">${car.models.name}</a>
							</li>
							<li class="car-info">
								版　　型：${car.stencilType}
							</li>
							<li class="car-info">
								颜　　色：${car.colorName}
							</li>
							<li class="car-info">
								变&nbsp;&nbsp;速&nbsp;&nbsp;箱：${car.tran}
							</li>
							<li class="car-info">
								排　　量：${car.displacement}L
							</li>
							<li class="car-info">
								行驶里程：${car.mileage}万公里
							</li>
							<li class="car-info">
								首次上牌：${car.registerMonth}
							</li>
						</ul>
						<div class="service-wrap">
							<div class="service">
								<span class="mmche-icon f-fl tui-icon"></span>
								<span class="mmche-icon f-fl jian-icon"></span>
								<span class="mmche-icon f-fr phone-icon">400-8828-557</span>
								<div class="f-clear"></div>
							</div>
						</div>
						<div class="btn-wrap">
							<a href="#" class="mmche-btn book-btn f-fl">
								立即预订
							</a>
							<div class="f-clear"></div>
						</div>
						<!--分享按钮 来自百度分享-->
						<div class="bdsharebuttonbox"><a href="#" class="bds_more" data-cmd="more">&nbsp;分享到：</a><a href="#" class="bds_qzone" data-cmd="qzone"></a><a href="#" class="bds_tsina" data-cmd="tsina"></a><a href="#" class="bds_tqq" data-cmd="tqq"></a><a href="#" class="bds_renren" data-cmd="renren"></a><a href="#" class="bds_weixin" data-cmd="weixin"></a></div>
						<script>window._bd_share_config={"common":{"bdSnsKey":{},"bdText":"","bdMini":"2","bdPic":"","bdStyle":"0","bdSize":"16"},"share":{},"image":{"viewList":["qzone","tsina","tqq","renren","weixin"],"viewText":"分享到：","viewSize":"16"},"selectShare":{"bdContainerClass":null,"bdSelectMiniList":["qzone","tsina","tqq","renren","weixin"]}};with(document)0[(getElementsByTagName('head')[0]||body).appendChild(createElement('script')).src='http://bdimg.share.baidu.com/static/api/js/share.js?v=89860593.js?cdnversion='+~(-new Date()/36e5)];</script>
						<!--分享按钮 end-->
					</div>
					<div class="f-clear"></div>
				</div>
				<!--car-info-wrap end-->
				<!--info-detail-wrap-->
				<div class="info-detail-wrap">
					<!--info-item 车主自述-->
					<div class="info-item">
						<div class="item-hd-wrap">
							<h2 class="crt-item mmche-icon f-fl">
								车辆概述
							</h2>
							<h2 class="f-fl">
								车况实拍
							</h2>
							<h2 class="f-fl">
								参数配置
							</h2>
							<div class="f-clear"></div>
						</div>
						<c:if test="${not empty car.online.sellPoint }">
						<div class="summary">
							<p class="summary-para">
								${car.online.sellPoint }
							</p>
						</div>
						</c:if>
					</div>
					<!--info-item 车主自述 end-->
					<!--info-item 车况实拍-->
					<div class="info-item">
						<div class="item-hd-wrap">
							<h2 class="crt-item mmche-icon">
								车况实拍
							</h2>
						</div>
						<div class="img-wrap">
							<c:forEach var="picName" items="${car.picName}" varStatus="status" >
							<img src="${car.imgPath}/${picName.big}" alt="${picName.fileName}" title="${picName.fileName}" width="732px" height="487px" />
							</c:forEach>
						</div>
					</div>
					<!--info-item 车况实拍 end-->
					<c:set var="configList" value="${car.standardConfig}"/>
					<c:if test="${not empty configList}">
					<!--info-item 参数配置-->
					<div class="info-item">
						<div class="item-hd-wrap">
							<h2 class="crt-item mmche-icon">
								参数配置
							</h2>
						</div>
						<table class="param-table">
							<tbody>
								<tr>
									<td colspan="4">
									<c:if test="${fn:length(configList)>1}">
										注：●标配 ○选配 -无
									</c:if>
									</td>
								</tr>
								<c:forEach var="configs" items="${configList}" varStatus="status">
								<c:forEach var="config" items="${configs}">
								<c:forEach var="items" items="${config.value}">
								<c:forEach var="item" items="${items}">
								<tr>
									<th colspan="4">
										${fn:replace(item.key,"。",".")}
									</th>
								</tr>
								<c:set var="contents" value="${item.value}" />
								<c:forEach var="i" begin="0" step="2"
									end="${fn:length(contents)-1}">
									<tr>
										<c:forEach var="content" items="${contents[i]}">
											<td>${fn:replace(content.key,"。",".")}</td>
											<td class="color-666">${content.value}</td>
										</c:forEach>
										<c:choose>
											<c:when test="${not empty contents[i+1]}">
												<c:forEach var="content" items="${contents[i+1]}">
													<td>${fn:replace(content.key,"。",".")}</td>
													<td class="color-666">${content.value}</td>
												</c:forEach>
											</c:when>
											<c:otherwise>
												<td></td>
												<td></td>
											</c:otherwise>
										</c:choose>
									</tr>
								</c:forEach>
								</c:forEach>
								</c:forEach>
								</c:forEach>
								</c:forEach>
							</tbody>
						</table>
					</div>
					<!--info-item 参数配置 end-->
					</c:if>
				</div>
				<!--info-detail-wrap end-->
			</div>
			<!--与buy-index.html的右侧部分html一样-->
			<div class="right-cnt f-fr">
				<c:if test="${not empty promoCars }">
				<!--cnt-wrap 限时特卖-->
				<div class="cnt-wrap">
					<div class="cnt-hd-wrap">
						<h2 class="f-fl">
							限时特卖
						</h2>
						<div class="f-clear"></div>
					</div>
					<ul class="cnt-list">
						<c:forEach var="promoCar" items="${promoCars}" varStatus="status">
						<li ${status.last ? 'class="border-none"':'' }>
							<div class="cnt-pro-img v-h-center">
								<a href="${contextPath}/car/${promoCar.id}.html">
									<img src="${promoCar.imgPath}/${promoCar.indexMainPicName}" title="${promoCar.online.title}" alt="${promoCar.online.title}" width="208px" height="166px"/>
								</a>
							</div>
							<div class="text-ellipsis cnt-pro-name">
								<a href="${contextPath}/car/${promoCar.id}.html">
									${promoCar.online.title}
								</a>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								<span>${promoCar.registerMonth}</span>&nbsp;&nbsp;<span>${promoCar.mileage}万公里</span>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								麦麦车一口价：<span class="price-sum">
								￥${promoCar.price}
							</span>
							</div>
						</li>
						</c:forEach>
					</ul>
				</div>
				<!--cnt-wrap end-->
				</c:if>
				<!--cnt-wrap 您可能感谢兴趣的车-->
				<c:if test="${not empty hotCars }">
				<div class="cnt-wrap">
					<div class="cnt-hd-wrap">
						<h2 class="f-fl">
							您可能感谢兴趣的车
						</h2>
						<div class="f-clear"></div>
					</div>
					<ul class="cnt-list">
						<c:forEach var="hotCar" items="${hotCars}" varStatus="status">
						<li ${status.last ? 'class="border-none"':'' }>
							<div class="cnt-pro-img v-h-center">
								<a href="${contextPath}/car/${hotCar.id}.html">
									<img src="${hotCar.imgPath}/${hotCar.indexMainPicName}" title="${hotCar.online.title}" alt="${hotCar.online.title}" width="208px" height="166px"/>
								</a>
							</div>
							<div class="text-ellipsis cnt-pro-name">
								<a href="${contextPath}/car/${hotCar.id}.html">
									${hotCar.online.title}
								</a>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								<span>${hotCar.registerMonth}</span>&nbsp;&nbsp;<span>${hotCar.mileage}万公里</span>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								麦麦车一口价：<span class="price-sum">
								￥${hotCar.price}
							</span>
							</div>
						</li>
						</c:forEach>
					</ul>
				</div>
				<!--cnt-wrap end-->
				</c:if>
				<!--cnt-wrap 历史浏览-->
				<c:if test="${not empty viewdCars }">
				<div class="cnt-wrap">
					<div class="cnt-hd-wrap">
						<h2 class="f-fl">
							历史浏览
						</h2>
						<div class="f-clear"></div>
					</div>
					<ul class="cnt-list">
						<c:forEach var="historyCar" items="${viewdCars}" varStatus="status">
						<li ${status.last ? 'class="border-none"':'' }>
							<div class="cnt-pro-img v-h-center">
								<a href="${contextPath}/car/${historyCar.id}.html">
									<img src="${historyCar.imgPath}/${historyCar.indexMainPicName}" title="${historyCar.online.title}" alt="${historyCar.online.title}" width="208px" height="166px"/>
								</a>
							</div>
							<div class="text-ellipsis cnt-pro-name">
								<a href="${contextPath}/car/${historyCar.id}.html">
									${historyCar.online.title}
								</a>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								<span>${historyCar.registerMonth}</span>&nbsp;&nbsp;<span>${historyCar.mileage}万公里</span>
							</div>
							<div class="cnt-pro-info text-ellipsis">
								麦麦车一口价：<span class="price-sum">
								￥${historyCar.price}
							</span>
							</div>
						</li>
						</c:forEach>
					</ul>
				</div>
				<!--cnt-wrap end-->
				</c:if>
			</div>
			<div class="f-clear"></div>
		</div>
	</div>
	<!--#cnt end-->
	<%@ include file="../include/foot.jsp"%>
	<script type="text/javascript" src="${jsPath}/resources/js/car.js"></script>
	<script>
	$(document).ready(function(){
	});
	</script>
</body>
</html>